<script setup>
import {login} from '@/api/user.js'
import { useToken } from '@/stores/token';
import {addRoutersInHome,gotoStudentManage,gotoStudentInfo} from '@/utils/router.js';
import { useHomeRouters } from '@/stores/homeRouter';

import router from '@/router/index'

const token = useToken();

const homeRouters = useHomeRouters();

const userLogin = async(data) => {
  console.log('login-view:data:',data);
  const res = await login(data);
  //设置token
  token.setToken(res.token);
  //设置路由
  console.log('login-view:res.routerInfo:',res.routerInfo);
  console.log('login-view:router-before:',router.getRoutes());

  homeRouters.setHomeRouters(res.routerInfo);
  //添加路由
  addRoutersInHome(res.routerInfo);

  console.log('login-view:router-end:',router.getRoutes());
  //跳转页面
  switch (data.identity){
    case 'admin':
      gotoStudentManage();
      break;
    case 'teacher':
      // todo: 跳转到教师信息管理界面
      break;
    case 'student':
      gotoStudentInfo();
      break;
  }
}

</script>
<template>
  <div class="login-bg">
  </div>
  <div class="login-container">
      <div class="form-left">教师评价考核系统</div>
      <LoginForm @login="userLogin"></LoginForm>
    </div>
</template>

<script>
import LoginForm from '@/components/login/LoginForm.vue';


</script>

<style scoped lang="less">

.login-bg{
  width: 100vw;
  height: 100vh;
  background: linear-gradient(45deg, #e4ecea 0%, #cdf3ec 50%,#dcefd3 50%, #e4ecea 100%);
  position: absolute;
  top: 0;
  left: 0;
}
.form-left{
  width: 400px;
  height: 500px;
  line-height: 500px;
  text-align: center;
  font-size: 40px;
  color: #616565;
}
.login-container {
  width: 800px;
  height: 500px;
  border: 1px solid rgb(82, 223, 245);
  position: absolute;
  top: 200px;
  left: 399px;
  background: radial-gradient(circle at center, #a2f6e8, transparent);
}
</style>
